import 'package:flutter/material.dart';

import '../common/banner_widget.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    //脚手架
    return DefaultTabController(
      length: 3,
      child: Scaffold(
        body: NestedScrollView(
          body: TabBarView(
            children: [
              //第一个页面
              buildListView1(),
              //第二个页面
              buildListView2(),
              //第三个页面
              buildListView3(),
            ],
          ),
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return [
              // SliverToBoxAdapter(child: Image.asset('asset/images/s03.png')),
              SliverAppBar(
                expandedHeight: 240,
                floating: true,
                snap: true,
                pinned: true,
                flexibleSpace: FlexibleSpaceBar(
                  title: Text('详情'),
                  background: BannerWidget(
                    imageList: ['asset/images/s02.png', 'asset/images/s03.png'],
                  ),
                ),
              ),

              SliverPersistentHeader(
                pinned: true,
                delegate: _CustomAppBarDelete(
                  minHeight: 70,
                  maxHeight: 80,
                  child: TabBar(
                    tabs: [
                      Tab(icon: Icon(Icons.info), text: '详情'),
                      Tab(icon: Icon(Icons.comment), text: '评论'),
                      Tab(icon: Icon(Icons.share), text: '分享'),
                    ],
                  ),
                ),
              ),
            ];
          },
        ),
      ),
    );
  }

  ListView buildListView1() {
    return ListView.builder(
      padding: EdgeInsets.only(left: 12, right: 12),
      itemCount: 100,
      itemBuilder: (BuildContext context, int index) {
        return Container(
          margin: EdgeInsets.only(bottom: 10),
          child: Row(
            children: [
              //左侧图片
              Image.asset(
                'asset/images/s02.png',
                width: 100,
                height: 60,
                fit: BoxFit.cover,
              ),
              SizedBox(width: 12),
              //右侧内容
              Expanded(
                child: Column(
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Text(
                      '这里是标题 $index',
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                    SizedBox(height: 6),
                    Text(
                      '这里是内容这里是内容这里是内容这里是内容这里是内容 ',
                      style: TextStyle(fontSize: 14, color: Colors.grey),
                    ),
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  buildListView2() {
    return ListView.builder(
      padding: EdgeInsets.only(top: 10, left: 10, right: 10),
      itemCount: 30,
      itemBuilder: (BuildContext context, int index) {
        return ListTile(
          leading: CircleAvatar(child: Text("UUU")),
          title: Text('用户 $index'),
          subtitle: Text('这里是第 $index 条评论 '),
        );
      },
    );
  }

  buildListView3() {
    return GridView.builder(
      itemCount: 20,
      padding: EdgeInsets.only(top: 10, left: 10, right: 10),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        crossAxisSpacing: 4,
        mainAxisSpacing: 4,
      ),
      itemBuilder: (BuildContext context, int index) {
        return Container(
          color: Colors.blue[100],
          child: Center(child: Text('分享 $index')),
        );
      },
    );
  }
}

class _CustomAppBarDelete extends SliverPersistentHeaderDelegate {
  final double maxHeight;
  final double minHeight;
  final Widget child;
  _CustomAppBarDelete({
    required this.minHeight,
    required this.maxHeight,
    required this.child,
  });
  @override
  Widget build(
    BuildContext context,
    double shrinkOffset,
    bool overlapsContent,
  ) {
    return SizedBox.expand(
      child: Container(
        padding: EdgeInsets.only(top: 8, bottom: 8),
        color: Colors.white,
        child: child,
      ),
    );
  }

  @override
  double get maxExtent => maxHeight;

  @override
  double get minExtent => minHeight;

  @override
  bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {
    return true;
  }
}
